<template>
  <lay-card title="查询">
    <lay-form :model="model" pane style="margin-top: 25px">
      <template v-for="value in inputs" :key="value">
        <lay-form-item :label="getLabel(value)" v-bind="value.labelAttrs" :mode="value.labelAttrs?.inline || 'inline'">
          <lay-select v-if="value.type === 'select'" v-model="model[value['key']]" v-bind="value.attrs" show-search
            allow-clear :placeholder="getLabel(value)">
            <template v-for="v in opList[value.key]" :key="v">
              <lay-select-option :value="v" :label="v"></lay-select-option>
            </template>
          </lay-select>

          <lay-date-picker v-else-if="value.type === 'date'" timestamp v-model="model[value['key']]" v-bind="value.attrs"
            simple :placeholder="getLabel(value)"></lay-date-picker>

          <lay-input v-else v-model="model[value['key']]" v-bind="value.attrs" allow-clear
            :placeholder="getLabel(value)"></lay-input>
        </lay-form-item>
      </template>
      <lay-form-item mode="inline">
        <lay-button type="primary" @click="submit">查询</lay-button>
        <lay-button type="default" @click="reset">重置</lay-button>
      </lay-form-item>
    </lay-form>
  </lay-card>
</template>

<script setup>
import { ref } from "vue";

const props = defineProps({
  inputs: Array,
  url: String
});

const emits = defineEmits(['submit'])

function getLabel(obj) {
  return obj.label || obj.key;
}

const submit = () => {
  emits('submit', { ...model.value })
};

function reset() {
  model.value = { ...defaultData };
  emits('submit', { ...model.value })
}

// 数据默认值
const defaultData = props.inputs.reduce((obj, v) => {
  if (v.default != undefined) {
    obj[v.key] = v.default;
  }
  return obj;
}, {});

const model = ref({ ...defaultData });

let opList = ref({});

import { $http } from "@/api";

$http.get("/api/" + props.url).then((res) => {
  if (res.code === 0) {
    opList.value = res.data;
  }
});
</script>

<style></style>